<template>
    <el-form ref="form" :model="form" :rules="rules">
        <el-form-item prop="name" label="角色名">
            <el-input type="text" v-model="form.name" :maxlength=50></el-input>
        </el-form-item>
        <el-form-item prop="bewrite" label="角色描述">
            <el-input type="textarea" v-model="form.bewrite" :maxlength=200></el-input>
        </el-form-item>
        <el-form-item class="text-center">
            <el-button @click="submit" :loading="btnload">提交</el-button>
        </el-form-item>
    </el-form>
</template>

<script>
    import {roleSave} from "@/api";

    export default {
        data() {
            return {
                rules: {
                    name: [
                        {required: true, message: '角色名不能为空', trigger: 'blur'}
                    ],
                    bewrite: [
                        {required: true, message: '角色描述不能为空', trigger: 'blur'}
                    ],
                }
                , btnload: false
                , roleID: 0
                , form: {
                    name: ''
                    , bewrite: ''
                    , status: 1
                }
            }
        }
        , props: ['pdata']
        , created() {
            if (this.pdata != null) {
                this.form = {
                    name: this.pdata.name
                    , bewrite: this.pdata.description
                    , status: this.pdata.status
                    , id: this.pdata.id
                };
            }
        }
        , methods: {
            submit() {
                this.$submit(this.$refs['form'], () => {
                    this.btnload = true;
                    roleSave(this.form, () => {
                        this.$message.success('操作成功');
                        this.$emit('close', true)
                    }, () => {
                        this.btnload = false;
                    })
                });
            }
        }
    }
</script>

<style>

</style>
